
//================================================================================
//       The graphing guts
//================================================================================
function ClockChart(times, deadlines) {
	this.times = times
	this.deadlines = deadlines
	this.radius = 50
	this.center = { "x":50, "y":50 }
}
ClockChart.prototype.render = function(ctx) {
	ctx.shadowColor = "rgba(32,32,32,0.8)"
	ctx.shadowOffsetX = 4
	ctx.shadowOffsetY = 4
	
	ctx.shadowBlur = 7
	ctx.beginPath()
	ctx.fillStyle = "rgb(255,255,255)"
	ctx.arc(this.center.x,this.center.y,this.radius,0,2*Math.PI,1)
	ctx.fill()
	
	ctx.shadowBlur=0
	ctx.shadowOffsetX=0
	ctx.shadowOffsetY=0
	ctx.shadowColor="rgb(255,255,255)"
	for(var tick=0;tick<=2*Math.PI;tick+=Math.PI/12) {
		ctx.beginPath()
		ctx.strokeStyle = "rgb(128,128,128)"
		ctx.lineWidth = 1
		ctx.arc(this.center.x, this.center.y, this.radius, tick, tick, 0)
		ctx.arc(this.center.x, this.center.y, this.radius*0.9, tick, tick, 0)
		ctx.stroke()
	}
	
	var angles = []
	var dayLength = 86400000
	
	var today = new Date()
	today.setHours(0,0,0,0)
	var thisDayValue = today.getTime()
	var nextDayValue = thisDayValue + dayLength
	
	this.times.sort()
	this.times.filter(new Function ("obj", "index", "array", "if (obj>=" + thisDayValue + " && obj<= " + nextDayValue + ") {return true}"))
	
	for (var ti=0;ti<this.times.length;ti++) {
		var A = 2 * Math.PI * (this.times[ti]-thisDayValue)/dayLength
		angles.push(A-Math.PI/2)
	}
	
	ctx.shadowBlur=0
	ctx.shadowColor = "rgb(255,255,255)"
	ctx.shadowOffsetX = 0
	ctx.shadowOffsetY = 0
	ctx.beginPath()
	ctx.fillStyle = "rgba(208,208,255,0.8)"
	ctx.lineWidth = 1
	//alert(angles.toSource())
	for (var ai=0;ai<angles.length-1;ai+=2) {
		ctx.arc(this.center.x,this.center.y,this.radius,angles[ai],angles[ai+1],0)
		ctx.lineTo(this.center.x,this.center.y)
		ctx.closePath()
		ctx.fill()
		//ctx.fillStyle="rgb(" + Math.random() * 255 + ",0,0)"
		//ctx.fill()
	}
	
	var angles = []
	
	this.times.sort()
	this.times.filter(new Function ("obj", "index", "array", "if (obj>=" + thisDayValue + " && obj<= " + nextDayValue + ") {return true}"))
	
	for (var ti=0;ti<this.deadlines.length;ti++) {
		var A = 2 * Math.PI * (this.deadlines[ti]-thisDayValue)/dayLength
		angles.push(A-Math.PI/2)
	}
	
	ctx.shadowBlur=0
	ctx.shadowColor = "rgb(255,255,255)"
	ctx.shadowOffsetX = 0
	ctx.shadowOffsetY = 0
	ctx.fillStyle = "rgba(208,208,208,0.8)"
	ctx.lineWidth = 1
	for (var ai=0;ai<angles.length-1;ai+=2) {
		ctx.beginPath()
		ctx.strokeStyle = "rgb(0,255,0)"
		ctx.arc(this.center.x,this.center.y,this.radius,angles[ai],angles[ai],0)
		ctx.lineTo(this.center.x,this.center.y)
		ctx.stroke()
		ctx.beginPath()
		ctx.arc(this.center.x,this.center.y,this.radius,angles[ai+1],angles[ai+1],0)
		ctx.lineTo(this.center.x,this.center.y)
		ctx.strokeStyle = "rgb(255,0,0)"
		ctx.stroke()
		//ctx.fillStyle="rgb(" + Math.random() * 255 + ",0,0)"
		//ctx.fill()
	}
	
	var A = 2 * Math.PI * ((new Date()).getTime()-thisDayValue)/dayLength
	ctx.beginPath()
	ctx.arc(this.center.x,this.center.y,this.radius*0.8,A,A,0)
	ctx.lineTo(this.center.x,this.center.y)
	ctx.lineWidth = 3
	ctx.strokeStyle = "rgb(128,128,128)"
	ctx.stroke()
}

function PieChart(values) {
	var total = 0
	for (var vi=0;vi<values.length;vi++)
		total+=values[vi]
	this.total = total
	this.values = values
	this.radius = 50
	this.center = { "x":50, "y":50 }
	this.colors = []
	for (var i=0;i<values.length;i++)
		this.colors.push("rgba(" + parseInt(Math.random() * 255) + "," + parseInt(Math.random() * 255) + "," + parseInt(Math.random() * 255) + ",0.65)")
}
PieChart.prototype.render = function(ctx) {

	//draw base circle with shadow
	ctx.shadowColor = "rgba(32,32,32,0.8)"
	ctx.shadowOffsetX = 4
	ctx.shadowOffsetY = 4
	
	ctx.shadowBlur = 7
	ctx.beginPath()
	ctx.fillStyle = "rgb(255,255,255)"
	ctx.arc(this.center.x,this.center.y,this.radius,0,2*Math.PI,1)
	ctx.fill()
	
	//draw tickmarks on circle
	ctx.shadowBlur=0
	ctx.shadowOffsetX=0
	ctx.shadowOffsetY=0
	ctx.shadowColor="rgb(255,255,255)"
	for(var tick=0;tick<=2*Math.PI;tick+=Math.PI/12) {
		ctx.beginPath()
		ctx.strokeStyle = "rgb(128,128,128)"
		ctx.lineWidth = 1
		ctx.arc(this.center.x, this.center.y, this.radius, tick, tick, 0)
		ctx.arc(this.center.x, this.center.y, this.radius*0.9, tick, tick, 0)
		ctx.stroke()
	}
	
	//calculate pie piece angles
	var angles = [0]
	
	//this.values.sort()
	
	var pv = 0
	for (var vi=0;vi<this.values.length;vi++) {
		pv += this.values[vi]
		var A = 2 * Math.PI * (pv)/this.total
		if (A==2*Math.PI) //IECanvas displays no arc in this case
			A=2*Math.PI-0.001
		angles.push(A)
	}
	
	angles.push(2*Math.PI)
	
	//draw pie pieces
	ctx.shadowBlur=0
	ctx.shadowColor = "rgb(255,255,255)"
	ctx.shadowOffsetX = 0
	ctx.shadowOffsetY = 0
	ctx.lineWidth = 1
	//alert(angles.toSource())
	for (var ai=0;ai<angles.length-2;ai++) {
		ctx.beginPath()
		ctx.fillStyle=this.colors[parseInt(ai)]
		ctx.arc(this.center.x,this.center.y,this.radius,angles[ai],angles[ai+1],0)
		ctx.lineTo(this.center.x,this.center.y)
		//ctx.fillStyle="rgba(" + parseInt(Math.random() * 255) + "," + parseInt(Math.random() * 255) + "," + parseInt(Math.random() * 255) + ",0.65)"
		ctx.fill()
	}
}
function LineChart(data) {
	this.data = data
	this.origin = { "x":200, "y":200 }
	this.height = 200
	this.width = 200
	this.filled = true
	var pts = this.data.length
	var max = this.data[0]
	var min = this.data[0]
	for (var di=1;di<pts;di++) {
		max = Math.max(max,this.data[di])
		min = Math.min(min,this.data[di])
	}
	this.max=max
	this.min=min
	this.style = "rgba(" + parseInt(Math.random() * 255) + "," + parseInt(Math.random() * 255) + "," + parseInt(Math.random() * 255) + ",0.40)"
	this.gridOn = true
	this.gridStep = 3
}
LineChart.prototype.render = function(ctx) {
	var pts = this.data.length
	var xWidth = this.width/(pts-1)
	var yHeight = (this.height+0.0)/(this.max)
	var yOffset = this.min
	var y
	
	ctx.beginPath()
	ctx.moveTo(this.origin.x, this.origin.y+this.height)
	for (var di=0;di<pts;di++) {
		y=Math.min(this.height,this.data[di]*yHeight)
		ctx.lineTo(this.origin.x+di*xWidth, this.origin.y+this.height-y)
	}
	ctx.lineTo(this.origin.x+(pts-1)*xWidth,this.origin.y+this.height)
	ctx.fillStyle=this.style
	ctx.strokeStyle=this.style
	if (this.filled)
		ctx.fill()
	else
		ctx.stroke()
	
	if (this.gridOn) {
		ctx.strokeStyle="#FFF"
		for (var y=0;y<this.max;y+=this.gridStep) {
			ctx.beginPath()
			ctx.moveTo(this.origin.x,this.origin.y+this.height-y*yHeight)
			ctx.lineTo(this.origin.x+this.width,this.origin.y+this.height-y*yHeight)
			ctx.stroke()
		}
	}
}